// An highlighted block
import { useEffect, useState } from 'react'

export function useWindowFontSize(size:number) {
  const [windowSize, setWindowSize] = useState(0)

  useEffect(() => {
    const handler = () => {
        let newSize = window.innerWidth*size/1920;
      setWindowSize(newSize)    
    }
    // Set size at the first client-side load 
    handler()
    window.addEventListener('resize', handler)

    // Remove event listener on cleanup
    return () => {
      window.removeEventListener('resize', handler)
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [])

  return windowSize
}